<template>

  <div>
    <van-checkbox-group v-model="result">
      <van-checkbox
        v-for="(item, index) in cartList"
        :name="item"
        :key="item.id"
        @click="checkOther(item)"
        class="ck"
      >
      
        <van-swipe-cell>
          <van-card
            
            :price="item.retail_price"
            :desc="item.goods_specifition_name_value"
            :title="item.goods_name"
            :thumb="item.list_pic_url"
            class="goods-card"
          />
          <!-- :num="item.number" -->
          <template #right>
            <van-button
              square
              text="删除"
              type="danger"
              class="delete-button"
              @click="delFun(item,index)"
            />
          </template>
          <div class="ipt">
            <button @click.stop="item.number++">+</button>
            <input type="text" name="" id="" :value="item.number">
            <button @click.stop='item.number<=1?0:item.number--'>-</button>
          </div>
        </van-swipe-cell>
      </van-checkbox>
    </van-checkbox-group>

    <van-submit-bar
      :price="totalPrice"
      button-text="提交订单"
      @submit="onSubmit"
      class="cart"
    >
      <van-checkbox v-model="checked" @click="checkAll">全选</van-checkbox>
      <template #tip>
        你的收货地址不支持同城送,
        <span @click="onClickEditAddress" class="adress">修改地址</span>
      </template>
    </van-submit-bar>
  </div>
</template>

<script>
import { getCartList } from "@/utils/https";
import {getDelete} from "@/utils/https";
export default {
  name: "WyyxCart",

  data() {
    return {
      result: [],
      checked: false,
      cartList: [],
    };
  },
  created() {
    console.log(this)
    
    getCartList().then((res) => {
      console.log(res, "渲染");
      this.cartList = res.data.data.cartList;
    });
    getDelete().then((res)=>{
      console.log(res,'删除')
    })
    console.log(this.cartList)
  },

  mounted() {},

  methods: {
    //提交订单
    onSubmit() {},
    //修改地址
    onClickEditAddress() {
          this.$router.push({path:'adress'})
    },
    //单选
    checkOther(item) {
      console.log(item)
      if(this.result.length==this.cartList.length){
        this.checked=true
      }
      else{
        this.checked=false
      }
    },
    //全选
    checkAll(){
      //选中
      console.log(this.checked)
      if(this.checked){
        this.result=this.cartList;
        

      }else if(this.cartList.length==0){
        this.checked=false
      }
      else{
        this.result=[]
      }
      
    },
    delFun(item){
        
      // console.log(this.checked)
      // this.cartList.splice(index,1)
      
      // console.log(this.cartList,111)
      // console.log(this.result,222)
      // this.result.forEach((item1,i)=>{
      //   if(item1.id==item.id){
      //     this.result.splice(i,1)
      //   }
      //   this.checkOther()
      //   console.log(this.result)
      // })
   
      // console.log(res)
  console.log(this.cartList.number)
    //  if(this.cartList.number==0){
    //    this.cartList.splice(index,1)

    //  }
      //  this.cartList.splice(index,1);
        // this.result.forEach((m,n)=>{
          // if(m.id==item.id){

            // console.log(m.id,item.id)
            // this.cartList.splice(n,1)
            // this.result.splice(n,1)
            // console.log(1111)
            getDelete({
               productIds:`${item.product_id}`
            }).then((res)=>{
              console.log(res)
            this.$router.go(0)

            })
          }
          
        
      // })
  
    
    // }
  },
  computed:{
    totalPrice(){
      let sum=0
      this.result.forEach((item)=>{
        sum+=item.retail_price*item.number*100
        })
        return sum
    }
  }
};
</script>

<style lang="less" scoped>

.cart {
  width: 100%;
  margin-bottom: 50px;
}
.delete-button {
  height: 100%;
}
.ck{
  display: flex;
    
 /deep/.van-checkbox__label{
      flex: 1;
}
  .ipt{
    position: absolute;
    right: 20px;
    bottom: 20px;
}
  input{
    width: 20px;
    font-size: 15px;
  }
    button{
      width: 20px;
      font-size: 15px;
    }
  }.goods-card {
    margin: 0;
    background-color: white;
}
.van-submit-bar__tip{
 span{
   font-style: italic;
   font-weight: 700;
   font-family: "黑体";
   font-size: 15px;
   color:rgba(2, 101, 240, 0.8)   
 }
}

</style>